
import React, { useContext, forwardRef } from 'react'
import CustomizeModal, { CustomizeModalContext } from "@common/presentational/CustomizeModal";

const PromotionStatsContent = props => {
    const { params } = useContext(CustomizeModalContext)
    const { off_amount, off_refund_trans_cnt, off_trans_cnt, participant_cnt } = params
    return (
        <div className='coupon-stats-modal'>
            <div className='stats-item'>
                <div className='stats-type'>总参与人数</div>
                <div className='number'>{participant_cnt}</div>
            </div>
            <div className='stats-item'>
                <div className='stats-type'>总订单数</div>
                <div className='number'>{off_trans_cnt}</div>
            </div>
            <div className='stats-item'>
                <div className='stats-type'>退款订单数</div>
                <div className='number'>{off_refund_trans_cnt}</div>
            </div>
            <div className='stats-item'>
                <div className='stats-type'>实际优惠金额</div>
                <div className='number'>{off_amount}</div>
            </div>
        </div>
    )
}

export default forwardRef((props, ref) => (
    <CustomizeModal title="活动数据" ref={ref} width={734} >
        <PromotionStatsContent {...props} />
    </CustomizeModal>
))